<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../assets/js/vue.js"></script>
    <link rel="stylesheet" href="../assets/css/index.css"/>
</head>
<body>
<h1>其他指令</h1>
<hr>
<div id="app">
    <p v-pre>{{message}} 显示源码</p>

    <p v-cloak>在浏览器为客户渲染完成之前你是看不到我的
        要和style一起用，而且style块要放在script块前面
    </p>

    <p v-once>原先输入的是:{{message}} 只显示一次，不跟着变</p>
    <textarea cols="30" rows="10" v-model="message"></textarea>

</div>

<style>
    [v-cloak]{
        display: none;
    }
</style>

<script>
    var app = new Vue({
        el: '#app',
        data: {
            message: 'hello Vue'
        }
    })
</script>
</body>
</html>